<template>
  <view class="margin-top-16 flex-row align-center" :style="{margin}">
    <view class="label">
      <text class="text-28 color-t1">{{ label }}</text>
    </view>
    <image v-if="image" class="image" :src="image" @click="viewImages" />
    <text v-else class="text-28 color-t1">{{ value }}</text>
  </view>
</template>

<script>
import { viewImage } from '@/common/util'
export default {
  name: 'DataCell',
  props: {
    label: {
      type: String,
      default: ''
    },
    value: {
      type: String,
      default: ''
    },
    image: {
      type: String,
      default: ''
    },
    margin: {
      type: String,
      default: ''
    }
  },
  methods: {
    viewImages() {
      viewImage(0, [this.image])
    }
  }
}
</script>

<style scoped lang="scss">
.label{
  width:168rpx;
}
.image{
  width:100rpx;
  height:100rpx;
  border-radius:8rpx;
}
</style>
